import React from 'react'
import { getNavBtn,getNavBtnAns } from '../../../api/navBtn'
const IconGroups = () => {
    const [iconList,setList] = React.useState<Array<any>>([{}])
    React.useEffect(() => {
        getNavBtn()
            .then(res => {
                const {code,data} = res as unknown as getNavBtnAns
                if(code === 200){
                    setList(data)
                }
            })
            .catch(err => {
                console.log(err);
            })
    },[ ])
    return (
        <div style={{
            width: '100vw',
            display: 'flex',
            flexFlow: 'row wrap'
        }}>
            {
                iconList?.map(item => {
                    return (
                        <img key={item.navbtnId + item.navbtnImg} src={item.navbtnImg} alt='imgIcon' style={{width: '20%'}}/>
                    )
                })
            }
        </div>
    )
}

export default IconGroups